<!--
 * @Date: 2024-10-21 09:48:31
 * @Author: LiSong
 * @LastEditors: LiSong
 * @LastEditTime: 2024-10-21 10:04:24
 * @Description: 行配置
-->
<template>
  <div class="widget-config-setting">
    <div class="setting-name">表格行配置</div>
    <div class="setting-body">
      <el-form-item label="高亮当前行(鼠标移到行)" class="form-setting-label-warp">
        <el-switch v-model="rowConfig.isHover"></el-switch>
      </el-form-item>
      <el-form-item label="高亮当前行(鼠标点击行)" class="form-setting-label-warp">
        <el-switch v-model="rowConfig.isCurrent"></el-switch>
      </el-form-item>
    </div>
  </div>
</template>

<script setup name="rowConfig-editor">
import { ref, reactive, computed } from 'vue';

const props = defineProps({
  // 设计器信息
  designer: { type: Object },
  // 组件选项信息
  optionModel: { type: Object },
  // 当前选中的组件
  selectedWidget: { type: Object },
});

const defConfig = {
  isHover: true,
  isCurrent: true,
}
// 表格的配置
const rowConfig = computed(() => {
  if (!props.optionModel.rowConfig) {
    props.optionModel.rowConfig = defConfig
  }
  return props.optionModel.rowConfig
})


</script>

<style lang="scss" scoped>
.form-setting-label-warp {
  :deep(.el-form-item__label) {
    display: block;
    height: auto;
    white-space: normal !important;
    line-height: 1.2rem;
  }
}
</style>
